<template>
	<view class="address">
		<view class="item" v-for="(item,i) in addressList" :key="i">
			<view class="name"><text>{{item.contactMan}}</text></view>
			<view class="phone"><text>{{item.contactPhone}}</text></view>
			<view class="area"><text>{{item.province}} {{item.city}} {{item.area}} </text></view>
			<view class="area"><text>{{item.position}}</text></view>
			<view class="bottom">
				<view v-if="item.isDefault == 1"><text class="text1">默认收货地址</text></view>
				<view v-if="item.isDefault == 0"><text class="text1" @click="setDefault(item.id)">设为默认收货地址</text></view>
				<view>
					<text class="btn" @click="edit(item.id)">编辑</text>
					<text class="btn" @click="del(item.id)">删除</text>
				</view>
			</view>
		</view>
		
		<button class="bottom-btn" @click="toAddAddress">新增收货地址</button>
	</view>
</template>

<script>
	import Api from '../../../util/api.js'
	export default {
		data() {
			return {
				addressList: [],
			};
		},
		onLoad() {
			this.getAddressList();
		},
		onShow(data){
			this.getAddressList();
		},
		methods: {
			getAddressList(){
				Api.fetchPost('/fsbus/M2200',{}).then(res=>{
					if(res.errorNo == 0){
						this.addressList = res.results.data.list;
					}
				}).catch(err=>{})
			},
			edit(id){
				uni.navigateTo({
						url: '/pages/my/addAddress/addAddress?addressId='+id
				});
			},
			del(id){
				var self = this;
				uni.showModal({
						title: '提示',
						content: '确认删除？',
						success: function (res) {
							if (res.confirm) {
									Api.fetchPost('/fsbus/M2206',{id:id}).then(res=>{
										if(res.errorNo == 0){
											self.getAddressList();
										}
									}).catch(err=>{})
							} 
						}
				});
			},
			setDefault(id){
				Api.fetchPost('/fsbus/M2205',{id:id}).then(res=>{
					if(res.errorNo == 0){
						this.getAddressList();
					}
				}).catch(err=>{})
			},
			toAddAddress(){
				uni.navigateTo({
						url: '/pages/my/addAddress/addAddress'
				});
			}
		}
	}
</script>

<style scoped="">
.address {
	width: 100%;
	min-height: 100%;
	position: absolute;
	background-color: #f3f3f3;
	font-size: 26upx;
	padding-bottom: 140upx;
}
.address .item {
	width: 100%;
	background-color: #fff;
	line-height: 40upx;
	margin-top: 20upx;
	padding: 20upx 40upx;
}
.address .name {
	color: #333;
	font-size: 40upx;
}
.address .phone {
	color: #333;
	font-size:  26upx;
	line-height: 56upx;
}
.address .area {
	color: #999;
	font-size: 22upx;
}
.address .bottom {
	display: flex;
	margin-top: 20upx;
}
.address .bottom>view:first-child {
	flex: 1;
}
.address .bottom>view:last-child {
	width: 200upx;
}
.address .bottom .txt1 {
	display: inline-block;
	height: 40upx;
}
.address .bottom .btn {
	width: 50%;
	display: inline-block;
	text-align: center;
	height: 40upx;
}
.bottom-btn {
	width: 100%;
	background-color: #4C4C4C;
	position: fixed;
	bottom: 0;
	left: 0;
	height: 120upx;
	line-height: 120upx;
	color: #fff;
	border-radius: 0;
}
</style>
